<template>
	<view class="login">

		<view class="login-head flex-y">
			<text class="login-head-h1">登录</text>
			<text class="login-head-h2">欢迎来到 ThinkAdminMobile V2.0</text>
		</view>

		<view class="login-body flex-y">

			<view class="flex-center">
				<text class="login-body-name">微信授权</text>
			</view>

			<view style="margin-top:80rpx;" class="flex-center">
				<uv-button type="success" shape="circle" size="large" @click="doLogin"
					custom-style="width:600rpx;height:100rpx" text="登 录" />
			</view>

		</view>

		<view class="login-foot">
			<view class='login-foot-agent flex-center tn-p-xl'>
				<uv-checkbox-group v-model="agent">
					<uv-checkbox shape="circle" activeColor="green" labelSize="26rpx" labelColor="#01beff" label="同意协议"
						:name="true" :checked="agent[0]" />
					<text @click="showAgreenment = true">《用户隐私协议》</text>
				</uv-checkbox-group>
			</view>
		</view>

		<m-show-agreement v-model:show="showAgreenment" @change="agentChange" />


	</view>
</template>

<script lang="ts">

import { defineComponent } from 'vue'
import { TaDataUser, TaLoading, TaToast } from '@/utils'

export default defineComponent({
	data() {
		return {
			// 同意协议
			agent: <any[]>[true],
			// 显示协议
			showAgreenment: <boolean>false,
			// 短信验证
			verify: <any>{
				time: 0,
				tips: '获取验证码',
				idxs: 0,
			},
		}
	},
	created() {
		// 如果已登录，直接跳转到首页
		TaDataUser.isLogin() && this.goto.back()
	},
	methods: {
		// 协议状态切换
		agentChange(state: boolean) {
			this.agent.splice(0, 1, state)
		},
		// 执行注册登录
		doLogin() {
			if (!this.agent[0]) {
				TaToast.error('请同意协议！')
				return false
			}
			TaLoading.show('登录中...');
			TaDataUser.init().then(() => this.goto.back()).finally(() => {
				TaLoading.hide();
			})
		}
	},
})
</script>

<style lang="scss" scoped>
@import "../m-login-phone/m-login-phone.scss";
</style>